//开发顺序:
//1.定义模板字符串
//2.获取外部数据
//3.商家数据渲染
//4.循环替换占位符
//5.替换商家图片banner
//6.替换商家品牌:新到或者品牌getBrand()
//7.替换商家名称
//8.替换评分为星星样式:new starScores(),使用starScores文件中的window全局方法
//9.替换月售:getMonthSale()
//10.替换配送时间
//11.替换配送距离
//12.替换配送费
//13.替换商家活动内容:getSaleTips
//14.实现滚动加载:
		/*
			14.1定义全局变量var page = 0; var isLoading = false;
			14.2定义滚动加载方法addEvent();监听滚动事件
			14.3满足加载条件时,调用getShopList方法
			14.4满足page>3的条件后,停止调用getShopList方法,返回isLoading = true
			14.5index.html中添加<div class="loading">加载中</div>
		 */
(function () {
	//商家列表模板字符串
	var itemTmpl = '<div class="r-content">' +
						'<img class="shop-img" src=$shop_img />'+
						'$shop-brand'+
						'<div class="r-content-item">' +
							'<div class="shop-name">$shop-name</div>'+
							'<div class="shop-detail clearfix">' +
								'<div class="score">$score</div>'+
								'<div class="month-sale">月售$month-sale</div>'+
								'<div class="distance">&nbsp;$distance</div>'+
								'<div class="time">$time&nbsp;|</div>'+
							'</div>'+
							'<div class="send-price">$send-price</div>'+
							'<div class="other-info">$other-info</div>'+
						'</div>'+
					'</div>';

	//定义全局变量:实现滚动加载更新
	var page = 0;
	var isLoading = false;

	/*
	*获取外部数据
	*/
	function getShopList() {
		page++;
		isLoading = true;
		//获取json数据
		$.get('/MeituanPR/json/homelist.json',function (data) {
			//打印数据,测试数据是否获取成功
			console.log(data);
			//提取json数据,获取不到则取空数组
			var list = data.data.poilist || [];
			initShopList(list);
			//可以触发第二次加载
			isLoading = false;
		})
	}

	/**
	 * 商家列表数据渲染
	 */
	function initShopList(list) {
		//循环替换占位符
		list.forEach(function (item,index) {
			var str = itemTmpl.replace('$shop_img',item.pic_url)
				.replace('$shop-brand',getBrand(item))
				.replace('$shop-name',item.name)
				.replace('$score',new starScores(item.wm_poi_score).getStars())
				.replace('$month-sale',getMonthSale(item))
				.replace('$time',item.mt_delivery_time)
				.replace('$distance',item.distance)
				.replace('$send-price',item.min_price_tip)
				.replace('$other-info',getSaleTips(item));
			$('.container').append($(str));
		})
	}
	
	/*
	*品牌或新到商家渲染 
	**/
	function getBrand(data) {
		if (data.brand_type){
			return '<div class="brand brand-pin">品牌</div>';
		}else {
			return  '<div class="brand brand-new">新到</div>';
		}
	}
	
	/*
	*月售数据渲染
	 */
	function getMonthSale(data) {
		var num = data.month_sale_num;
		//月售数量显示值设置
		if (num>999){
			return '999+';
		}else {
			return num;
		}
	}

	/*
	*渲染商家活动信息
	 */
	function getSaleTips(data) {
		var arr = data.discounts2;
		var str = '';
		arr.forEach(function (item,index) {

			//内部商家活动模板字符串
			var shopTip = '<div class="other-info-items">' +
						  		'<img class="img-item" src=$img-item />'+
								'<p class="info-item one-line">$info-item</p>'+
						  '</div>';

			shopTip =shopTip.replace('$img-item',item.icon_url)
							.replace('$info-item',item.info);

			str += shopTip;
		})

		return str;
	}

	/*
	 *滚动加载
	 */
	function addEvent() {
		window.addEventListener('scroll',function () {
			var clientHeight = document.documentElement.clientHeight;
			var scrollHeight = document.body.scrollHeight;
			var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

			//提前量:在达到判定式要求前滚动加载,减少等待
			var proDis = 30;
			if ((scrollTop + clientHeight)>=(scrollHeight-proDis)){
				if (page<3){
					//最多滚动加载3页
					//确保同一时间内只能触发一次滚动加载,在发送ajax请求时避免触发多次滚动加载
					if (isLoading){
						return;
					}
					//加载商家数据列表
					getShopList();
				}

			}

		})
	}
	
	//初始化程序
	function init() {
		getShopList();
		addEvent();
	}

	init();
})();